import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
// 数据持久化
import createPersistedState from "vuex-persistedstate"
export default new Vuex.Store({
    plugins: [createPersistedState({
        key: 'TodoList',
        paths:['list']
    })],
    state: {
        list: [
            { id: 100, name: "吃饭", isDone: true },
            { id: 101, name: "睡觉", isDone: false },
            { id: 102, name: "打豆豆", isDone: true },
        ],
        getSel:'all'
    },
    mutations: {
        // 回车增加事件
    addTodoTaskFn(state,task){
        state.list.push(task)
        
     },
     // 删除事件
     delTodoTaskFn(state,id) {
        state.list = state.list.filter(item => item.id !== id)
        },
     // 修改getSel
        changeGetSel(state,type) {
            state.getSel = type
      },
        // 清除已完成
       delFinished(state) {
           state.list = state.list.filter(item =>!item.isDone)
       }
     
    },
    getters: {
        showlist(state) {
            if (state.getSel === 'yes') {
               return state.list.filter(item => item.isDone)
            } else if (state.getSel === 'no') {
                return   state.list.filter(item => !item.isDone)
           } else {
             return state.list 
            }
        }
    }
    
})